<template>
	<div class="nav">
		123
		<transition
		    enter-class=""
		    enter-active-class="animated fadeIn"
		    enter-to-class=""
		    leave-class=""
		    leave-active-class="animated fadeOut"
		    leave-to-class=""
		>
			<div class="zz" v-if="show"></div>
		</transition>
<!-- 		<transition
		    enter-class=""
		    enter-active-class="animated fadeInRight"
		    enter-to-class=""
		    leave-class=""
		    leave-active-class="animated fadeOutRight"
		    leave-to-class=""
		>
			<div class="navtwo" v-if="show" @click="show=false"></div>
		</transition>	 -->
	</div>	
</template>

<script>
	export default{
		data(){
			return{
				show : false
			}
		},
		// mounted钩子函数
		mounted() {
			this.$eventbus.$on('czw',function(){
				this.show = !this.show
			}.bind(this))
		}
	}
</script>

<style lang="scss">
	.nav{
		width: 100%;
		height: 100%;
	}
</style>

